const beep = require("beepbeep")

const gulp = require("gulp")
const plumber = require("gulp-plumber")
const concat = require("gulp-concat")
const declare = require("gulp-declare")
const rename = require("gulp-rename")

const jade = require("gulp-jade")
const stylus = require("gulp-stylus")
const cleanCss = require("gulp-clean-css")
const autoprefixer = require("gulp-autoprefixer")

const browserify = require("browserify")
const babel = require("babelify")
const source = require("vinyl-source-stream")
const buffer = require("vinyl-buffer")

const sequence = require("gulp-sequence")
const hash = require("gulp-hash-src")

const eslint = require("gulp-eslint")

function errorHandler(err) {
    beep(2)
    console.error(err.toString())
}

// =================== common ======================

gulp.task("js", function() {
    let bundler = browserify("src/index.js", {debug: false})
        .transform(babel)
    return bundler.bundle()
        .on("error", errorHandler)
        .pipe(source("app.js"))
        .pipe(buffer())
        .pipe(gulp.dest("build"))
})

gulp.task("eslint", function() {
    gulp.src(["src/**/*.js"])
        .pipe(plumber({errorHandler: errorHandler}))
        .pipe(eslint())
        .pipe(eslint.format())
    // .pipe(eslint.failAfterError())
})

gulp.task("template", function() {
    return gulp.src(["src/**/*.jade", "!src/index.jade", "../vc-show/**/*.jade"])
        .pipe(plumber({errorHandler: errorHandler}))
        .pipe(jade({client: true}))
        .pipe(declare({namespace: "ST", noRedeclare: true}))
        .pipe(concat("template.js"))
        .pipe(gulp.dest("build"))
})

const CSS_PREFIX = ["ie >= 8",
    "ie_mob >= 10",
    "ff >= 30",
    "chrome >= 34",
    "safari >= 7",
    "opera >= 23",
    "ios >= 7",
    "android >= 4.4",
    "bb >= 10"]

gulp.task("stylus", function() {
    return gulp.src(["src/**/*.styl", "../vc-show/**/*.styl"])
        .pipe(plumber({errorHandler: errorHandler}))
        .pipe(stylus())
        .pipe(autoprefixer(CSS_PREFIX))
        .pipe(cleanCss({compatibility: "ie8"}))
        .pipe(concat("app.css"))
        .pipe(gulp.dest("build"))
})

gulp.task("index", [], function() {
    return gulp.src("src/index.jade")
        .pipe(plumber({errorHandler: errorHandler}))
        .pipe(jade({client: false}))
        .pipe(rename("index-tmp.html"))
        .pipe(gulp.dest("build"))
})

gulp.task("lib", function() {
    gulp.src("lib/**")
        .pipe(plumber({errorHandler: errorHandler}))
        .pipe(gulp.dest("build/lib"))
})

gulp.task("img", function() {
    gulp.src("img/**")
        .pipe(plumber({errorHandler: errorHandler}))
        .pipe(gulp.dest("build/img"))
})

gulp.task("hash", function() {
    return gulp.src(["build/index-tmp.html"])
        .pipe(plumber({errorHandler: errorHandler}))
        .pipe(hash({build_dir: "build", src_path: "src", hash_len: 6}))
        .pipe(rename("index.html"))
        .pipe(gulp.dest("./build"))
})

gulp.task("js-hash", function(cb) { sequence("js", "hash")(cb) })
gulp.task("stylus-hash", function(cb) { sequence("stylus", "hash")(cb) })
gulp.task("template-hash", function(cb) { sequence("template", "hash")(cb) })
gulp.task("index-hash", function(cb) { sequence("index", "hash")(cb) })

gulp.task("watch", ["default"], function() {
    gulp.watch("src/**/*.js", ["eslint", "js-hash"])
    gulp.watch("../vc-show/**/*.js", ["eslint", "js-hash"])
    gulp.watch("src/**/*.jade", ["template-hash"])
    gulp.watch("../vc-show/**/*.jade", ["template-hash"])
    gulp.watch("src/**/*.styl", ["stylus-hash"])
    gulp.watch("../vc-show/**/*.styl", ["stylus-hash"])
    gulp.watch("src/**/*.jade", ["index-hash"])
    gulp.watch("lib/**", ["lib"])
    gulp.watch("img/**", ["img"])
})

gulp.task("default", sequence(
    ["lib", "img"],
    "eslint",
    ["index", "js", "template", "stylus"],
    "hash"
))
